<!DOCTYPE html>
<html>
<!---需要技术支持联系QQ：44312658--->
<head>
    <meta charset="utf-8">
    <title>登录界面</title>
    <link rel="stylesheet" href="css/reset.css"/>
    <link rel="stylesheet" href="css/common.css"/>
    <link rel="stylesheet" href="css/font-awesome.min.css"/>
    <!--引入layui组件-->
    <link rel="stylesheet" href="layui/css/layui.css"/>
    <script type="text/javascript" src="layui/layui.js"></script>
</head>
<body>
<div class="wrap login_wrap">
    <div class="content">
        <div class="logo"></div>
        <div class="login_box">

            <div class="login_form">
                <div class="login_title">
                    登录
                </div>
                <form action="#" method="post">

                    <div class="form_text_ipt">
                        <input name="username" type="text" placeholder="用户名/手机号/邮箱">
                    </div>
                    <div class="ececk_warning"><span>用户名/手机号/邮箱不能为空</span></div>
                    <div class="form_text_ipt">
                        <input name="password" type="password" placeholder="密码">
                    </div>
                    <div class="ececk_warning"><span>密码不能为空</span></div>
                    <div class="form_check_ipt">
                        <div class="left check_left">
                            <label><input id="rememberme" checked type="checkbox"> 记住我</label>
                        </div>
                        <div class="right check_right">
                            <a href="#">忘记密码</a>
                        </div>
                    </div>
                    <div class="form_btn">
                        <button type="button" onclick="doLogin()">登录</button>
                    </div>
                    <div class="form_reg_btn">
                        <span>还没有帐号？</span><a href="reg.html">马上注册</a>
                    </div>
                </form>
                <div class="other_login">
                    <div class="left other_left">
                        <span>其它登录方式</span>
                    </div>
                    <div class="right other_right">
                        <a href="#"><i class="fa fa-qq fa-2x"></i></a>
                        <a href="#"><i class="fa fa-weixin fa-2x"></i></a>
                        <a href="#"><i class="fa fa-weibo fa-2x"></i></a>
                    </div>
                </div>
                <div style="text-align: center">
                    <span><a href="index.html">返回首页</a></span>
                    <br/>
                    <br/>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/common.js"></script>
<script src="js/myCookie.js"></script>
<div style="text-align:center;">
</div>
</body>
<script>

    layui.use(['layer'], function(){
        var layer = layui.layer;
    });

    document.querySelector("[name='username']").value = Cookie.get("username.servletdemo.com");
    document.querySelector("[name='password']").value = Cookie.get("password.servletdemo.com");

    function doLogin() {
        let username = document.querySelector("[name='username']").value;
        let password = document.querySelector("[name='password']").value;
        console.log("用户名：" + username);
        console.log("密码：" + password);

        $.ajax({
            url: "https://localhost:8443/servletdemo/users/login?username=" + username + '&password=' + password,
            type: "GET",
            dataType: "text",
            success: function (resp) {
                let result = JSON.parse(resp); //字符串转成json对象

                //console.log(resp);
                if (result.code === 200) {
                    console.log("登录成功的用户对象是");
                    console.log(result.data);
                    //把服务器返回的登录成功的用户对象保存到浏览器缓存里面
                    localStorage.setItem("currentLoginUser.servletdemo.com",JSON.stringify(result.data));

                    //判断客户是否选择记住账号
                    if($("#rememberme").is(":checked")){
                        //console.log('记住我！');
                        Cookie.set("username.servletdemo.com",username,100);
                        Cookie.set("password.servletdemo.com",password,100);

                    }else{
                        //console.log("忘记我！");
                        Cookie.remove("username.servletdemo.com");
                        Cookie.remove("password.servletdemo.com");
                    }


                    window.setTimeout("javascript:window.location.href='index.html'",2000);
                    //window.location.href = "index.html";
                } else {
                    layer.msg('登录失败，请检查用户名或者密码是否正确！')
                }
            }
        });

        //console.log("执行用户登录...");
    }


</script>
</html>

